/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 6px;
}

*::-webkit-scrollbar-track {
  background: var(--scroll-bg);
}

*::-webkit-scrollbar-thumb {
  background-color: var(--scroll-color);
  border-radius: 0px;
}

* {
  scrollbar-width: thin;
  scrollbar-color: var(--scroll-color) var(--scroll-bg);
}

.awesomplete .input-with-feedback {
  border: 1px solid var(--border-color);
}

/* .form-control {
  border: 1px solid var(--border-color);
} */

.search-bar .awesomplete input {
  background-color: var(--bg-color)
}

.modal-backdrop {
  background-color: #2c436b !important;
}

.widget .widget-head .widget-title {
  font-size: var(--text-base);
}

.comment-box .comment-input-header,
.form-dashboard-section .section-head,
.form-section .section-head,
.head-title {
  font-size: var(--text-base);
  font-weight: 600;
}

.comment-box .comment-input-container .ql-editor {
  border: 1px solid var(--border-color);
}

.duration-picker .duration-input {
  background-color: var(--bg-color);
  border: 1px solid var(--border-color);
}

.control-label {
  font-weight: 500;
}

[data-theme="dark"] {
  --bg-color: var(--gray-900);
  --disabled-control-bg: var(--gray-900);
  --border-color: #1c2126;
  --margin-lg: 15px;
  --text-bold: 600;
  --scroll-bg: #161a1f;
  --scroll-color: #1c2126;
}

[data-theme="light"] {
  --bg-color: #f2f5fa;
  --text-bold: 600;
  --control-bg: #cbe0f46e;
  --control-bg-on-gray: #d4dcea;
  --disabled-control-bg: #f2f5fa;
  --heading-color: #333;
  --border-color: #e3e8f1;
  --avatar-frame-bg: #dde2ea;
  --margin-lg: 15px;
  --sidebar-select-color: #2490ef30;
  --awesomplete-hover-bg: #d4dcea;
  --scroll-bg: #ccc;
  --scroll-color: var(--secondary-color);
}

/* Global CSS */

/* Colours */
:root {
  --background-color: #27567b;
  --primary-color: #2490ef;
  --secondary-color: #27567b;
  --white-color: #FEFFF0;
  --black-color: #000000;
  --gray-color: #d1d8dd;

}

.btn-primary:active,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary:focus {
  box-shadow: none !important;
}

.btn-primary {
  color: #F8F5F3 !important;
  background-color: var(--primary-color) !important;
  border-radius: 0 !important;
}

.btn-primary:hover {
  background-color: #17a2b8 !important;
}

/* .btn-secondary{
  background-color: #606060 !important;
  color: var(--white-color) !important;
  border-radius: 0 !important;
  transition: background-color ease-in-out .15s;
}
.btn-secondary:hover{
  background-color: rgba(255, 120, 10, 0.93) !important;
} */
/* .page-head,
.page-head .page-head-content{
  height: 50px;
}

*/

/* Top Header */
.navbar {
  background: var(--background-color) !important;
  /*     height: 50px; */
}

.navbar-expand {
  background-color: var(--background-color);
}

#navbar-breadcrumbs>li>a::before {
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  text-decoration: inherit;
  -webkit-font-smoothing: antialiased;
  margin-right: .3em;
  display: inline-block;

  font-size: 24px;
  transition: 0.2s;
  position: relative;
  top: 3px;
  content: "\f105";
  margin-right: 10px;
  color: var(--white-color);
}

#navbar-breadcrumbs a {
  color: var(--white-color) !important;
  ;
  text-decoration: none;
}

header .form-control {
  color: var(--white-color);
}

header .form-control:focus {
  border: 0;
}

.search-bar .awesomplete input {
  height: 32px;
}

/*#navbar-search{
  width: 300px;
  background-color: rgb(65, 78, 90);
  border-radius: 0px;
  color: #f9f9f9;
  border: none;
}*/
header ul#navbar-breadcrumbs {
  margin-top: -8px;
}

header .form-control:focus {
  background-color: var(--white-color) !important;
}

/* Sidebar */
.layout-side-section .sidebar-label {
  color: var(--primary-color);
}

.sidebar-label svg,
.layout-side-section .sidebar-label .icon {
  stroke: var(--primary-color);
}

.list-sidebar-button {
  /*   background-color: #c8c4c4 !important; */
  box-shadow: none !important;
}

.list-sidebar-button:active,
.list-sidebar-button:focus {
  text-decoration: none !important;
  box-shadow: none !important;
}

/* Input Fields */
input {
  border-radius: 0 !important;
}

.form-control {
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  background-color: #f2f2f2 !important;
}

.form-control:focus {
  outline: 0;
  border: 1px solid var(--primary-color);
  box-shadow: none;
  background: #cbe0f4 !important;
}

.navbar .navbar-nav a.nav-link {
  color: var(--white-color);
}

span.notifications-seen use,
symbol#icon-small-down {
  fill: var(--white-color);
}

/* Table */
.form-grid {
  border-radius: 0;
  /*   border: 1px solid #bbbbbb; */
}

.form-grid .grid-heading-row {
  background-color: #f4f4f4;
}

.grid-heading-row {
  border-bottom: 1px solid var(--primary-color);
}

.grid-row>.row .col {
  border-right: 1px solid #d1d8dd;
}

.form-grid .grid-row:hover {
  background: rgba(0, 153, 255, 0.08);
}

/* Heading Color */
.head-title,
.form-section .section-head,
.form-dashboard-section .section-head,
.comment-box .comment-input-header {
  color: var(--primary-color);
}

/* Lists */
.list-subject a {
  text-decoration: none;
  transition: 0.3s;
}

.list-subject a:hover {
  color: var(--secondary-color);
}

/* Report Table */
.datatable .dt-header .dt-cell--header .dt-cell__content {
  background-color: #f4f4f4;
}

.datatable .dt-scrollable .dt-row:nth-child(odd) {
  --dt-cell-bg: #f8f0f08c;
}

/* Buttons CSS
.filter-button,
.sort-selector-button,
.btn-order{
  background-color: #ea7272 !important;
  color: var(--white-color) !important;
  transition: 0.3s;
  border-radius: 0 !important;
}
.filter-button:hover,
.sort-selector-button:hover,
.btn-order:hover{
  background-color: #c83b3b !important;
}
.filter-button span.filter-icon{
  color: var(--white-color);
}
.filter-button span.filter-icon svg.icon{
  stroke: var(--white-color);
} */